<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
		<title>XML Grid Example</title>
		<link rel="stylesheet" type="text/css" href="js/extjs/resources/css/ext-all.css" />
 		<script type="text/javascript" src="js/extjs/adapter/ext/ext-base.js"></script>
    	<script type="text/javascript" src="js/extjs/ext-all.js"></script>
		<style type="text/css">
		html, body {
        	font:normal 12px verdana;
	        margin:0;
	        padding:0;
	        border:0 none;
	        overflow:hidden;
	        height:100%;
	    }
		p {
		    margin:5px;
		}
	    .settings {
	        background-image:url(../shared/icons/fam/folder_wrench.png);
	    }
	    .nav {
	        background-image:url(../shared/icons/fam/folder_go.png);
	    }
	    </style>
		<script type="text/javascript">
	    Ext.onReady(function(){
	        Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

			var tabpanel = new Ext.TabPanel({
		                            border:false,
		                            activeTab:0,
		                            tabPosition:'top',
		                            items:[{
		                                html:'<p>A TabPanel component can be a region.</p>',
		                                title: 'A Tab',
		                                autoScroll:true
		                            }]
		                        })

	       var viewport = new Ext.Viewport({
	            layout:'border',
	            items:[
	                new Ext.BoxComponent({ // raw
	                    region:'north',
	                    el: 'north',
	                    height:70
	                }), {
	                    region:'east',
	                    title: 'East Side',
	                    collapsible: true,
	                    split:true,
	                    width: 300,
	                    minSize: 175,
	                    maxSize: 400,
	                    layout:'fit',
	                    margins:'0 5 0 0',
						contentEl:'east'
	                 },
					 {
	                    region:'center',
	                    contentEl:'center1',
	                }
	             ]
	        });

		    });
		</script>

	</head>
<body>
<!--
  <div id="west">
    <p>Hi. I'm the west panel.</p>
  </div>
-->
  <div id="north">
    <p>PROYECTO SELECCIONADO: </p>
  </div>
  <div id="center1">
        <div id="example-grid"></div>
  </div>
  <div id="props-panel" style="width:200px;height:200px;overflow:hidden;">
  </div>

  <div id="east">
    <p>XAdmin</p>
  </div>
  <div id="south">
    <p>XAdmin</p>
  </div>

</body>
</html>